<template>
	<view class="bg">
		<u--input placeholder="搜索" prefixIcon="search" color="#fff" v-model="form.keyword" @confirm="list"
			prefixIconStyle="font-size: 22px;color: #858BA3"></u--input>
		<view class="box_fu" v-if="listData.length>0">
			<view class="box" v-for="item in listData" :key="suggest_id">
				<view class="box_top">
					<view class="box_left">
						<image src="../../static/tx.png" mode=""></image>
						<view class="">
							<text>{{item.nickname}}</text>
							<view style="margin-top: 9rpx;">
								{{item.create_time}}
							</view>
						</view>

					</view>

				</view>
				<view class="minbtn">
					{{item.type_name}}
				</view>
				<view class="neirong">
					{{item.content}}
				</view>
			</view>
		</view>
		<!-- 	<view class="xiala">
			<image src="../../static/xiala.png" mode=""></image>下拉加载更多~
		</view> -->
		<u-empty v-else text="当前暂无数据记录" textColor="#858BA3" textSize="30" width="276" height="231" marginTop="261"
			icon="https://njyyl.oss-cn-hangzhou.aliyuncs.com/data-monitor/zwxx.png">
		</u-empty>
	</view>
</template>

<script>
	import {
		suggestList
	} from '@/api/url.js'
	export default {
		data() {
			return {
				form: {
					page: 1,
					keyword: '',
					limit: 100
				},
				listData: {}
			}
		},
		onLoad(option) {
			this.list()
		},
		methods: {
			list() {
				var that = this
				var token = uni.getStorageSync('token')
				suggestList(that.form, token).then(res => {
					console.log(res)
					that.listData = res.data
				}).catch(err => {
					console.log(err)
				})
			},
			wenti() {
				// 热门问题
				var that = this
				axios({
					url: ' http://equity.njyyl.net/gen/question/front/info', //这里写你要发请求的服务器url
					params: {
						id: that.id
					}
				}).then(res => {
					console.log(res);
					that.xq = res.data.data
				})
			},
			quanyi() {
				var that = this
				axios({
					url: ' http://equity.njyyl.net/gen/vip/front/info', //这里写你要发请求的服务器url
					params: {
						id: that.id
					}
				}).then(res => {
					console.log(res);
					that.xq = res.data.data
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		height: 100vh;
		background-color: #30324C;
		padding: 47rpx 36rpx;
		box-sizing: border-box;
		position: relative;
	}

	.bg {

		.u-input {
			background-color: #20243C;
		}

		.xiala {
			position: absolute;
			bottom: 100rpx;
			left: 0;
			right: 0;
			margin: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #858BA3;
			font-size: 24rpx;

			image {
				width: 48rpx;
				height: 32rpx;
				margin-right: 14rpx;
			}
		}

		.box_fu {
			margin-top: 27rpx;
			width: 100%;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;

			.box {

				width: 48%;
				margin-bottom: 10rpx;
				border-radius: 20rpx;
				padding: 16rpx 9rpx;
				box-sizing: border-box;

				image {
					width: 56rpx;
					height: 56rpx;
					margin-right: 15rpx;
				}

				background-color: #20243C;




			}

			.box_top {
				display: flex;
				justify-content: space-between;

				.box_left {
					display: flex;
					color: #FFFFFF;
					font-size: 18rpx;
					font-weight: 600;
					// align-items: center;
				}


			}

			.minbtn {
				width: 100%;
				margin-top: 10rpx;
				text-align: center;
				font-size: 12rpx;
				color: #3F4041;
				border-radius: 13rpx;
				background: linear-gradient(to right, #EFE0C9, #F5C7A6);
				height: 25rpx;
				line-height: 25rpx;
			}

			.neirong {
				border-radius: 8rpx;
				background-color: #30324C;
				padding: 16rpx;
				font-size: 20rpx;
				color: #fff;
				margin-top: 16rpx;
				min-height: 116rpx;
			}
		}
	}
</style>